// pages/mySkills/mySkills.js
import { request } from "../../utils/index.js";
Page({

  /**
   * 页面的初始数据
   */
  data: {
    baseUrl:getApp().globalData.baseUrl,
    imgUrl: getApp().globalData.baseUrl + "/uploads/",
    name:"", // 技能名
    desc:"", // 相关介绍
    fileList: [], // 上传图片
    id:null, // 主键id
  },

  // 介绍内容
  onChangeName(event){
    this.setData({
      name:event.detail
    })
  },

  // 技能名
  onChangeContent(event){
    this.setData({
      desc:event.detail
    })
  },

  afterRead(event) {
    var that = this;
    const { file } = event.detail;
    // 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
    wx.uploadFile({
      url:  that.data.baseUrl + '/api/base64Upload',
      filePath: file.url,
      name: 'imgurl',
      header: {
        "Content-Type": "multipart/form-data",
        'Content-Type': 'application/json',    
        'Authorization': 'Bearer '+wx.getStorageSync("token"),  
      },
      formData: { },
      success(res) {
        console.log(res)
        var obj = JSON.parse(res.data); 
        // 上传完成需要更新 fileList
        const { fileList = [] } = that.data;
        fileList.push({ ...file, url: obj.data, deletable: true,});
        that.setData({ fileList });
        console.log(that.data.fileList)
      },
    });
  },

   // 删除图片
  delete(event) {
    console.log(event)
    let imgDelIndex = event.detail.index
    let fileList = this.data.fileList
    fileList.splice(imgDelIndex,1)
    console.log('删除图片的',fileList)
    this.setData({
        fileList
    })
  },

  // 预览图片
  previewImg(){

    if (this.data.fileList) {
      console.log(this.data.imgUrl + this.data.fileList[0].url);
      wx.previewImage({
        current: this.data.imgUrl + this.data.fileList[0].url,     //当前图片地址
        urls: [this.data.imgUrl + this.data.fileList[0].url],     //所有要预览的图片的地址集合 数组形式
        success: function(res) {},
        fail: function(res) {},
        complete: function(res) {},
      })
    }
   
  },

  // 保存
  onSubmit(){
    console.log(this.data.fileList)
    var that = this;
    if (that.data.id == null) {
      request({ url: "/api/skill/create",data:{
        name: that.data.name,
        desc: that.data.desc,
        image:that.data.fileList[0].url
      }})
      .then(result => {
        wx.showToast({
          title: result.msg,
          icon: 'none',
          duration:2000
        });
      })
    }else {
      request({ url: "/api/skill/update",data:{
        id: that.data.id,
        name: that.data.name,
        desc: that.data.desc,
        image:that.data.fileList[0].url
      }})
      .then(result => {
        wx.showToast({
          title: result.msg,
          icon: 'none',
          duration:2000
        });
      })
    }
 
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    if (options.jsonStr) {
      var that = this;
      let item=JSON.parse(decodeURIComponent(options.jsonStr));
      console.log(item.image)
      const { fileList = [] } = that.data;
      fileList.push({thumb:that.data.imgUrl + item.image,url:item.image, deletable: true,});
      that.setData({
        id:item.id,
        name:item.name,
        desc:item.desc,
        image:item.image,
        fileList:fileList,
      })
    }
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})